<template>
  <div class="app-container" style="box-sizing: border-box;overflow: auto">
    <div v-if="!questionVisible">
      <div v-for="post in postSubjectTree" :key="post.id">
        <el-divider>
          <h1>{{ post.name }} </h1>
        </el-divider>
        <el-row style="margin-top: 10px" :gutter="10">
          <template v-for="subject in post.children">
            <template v-for="knowledgePoint in subject.children">
              <el-col :span="6" v-for="trainSchedule in knowledgePoint.trainSchedules" :key="trainSchedule.id">
                <el-card>
                  <template v-slot:header>
                    <div style="display: flex;flex-direction: row">
                      {{ subject.name + '-' + knowledgePoint.name }}
                      <el-button style="margin-left: auto" type="primary" icon="el-icon-right" size="mini"
                                 @click="handleTrain(post.id,subject.id, knowledgePoint.id)">{{
                        }}
                      </el-button>
                    </div>

                  </template>
                  <li>岗位级别：
                    <dict-tag dict-tag :options="dict.type.post_level" :value="trainSchedule.postLevelId"
                              style="display: inline-block;"></dict-tag>
                  </li>
                  <li>题目数量：{{ trainSchedule.questionNum }}</li>
                  <li>训练数量：{{ trainSchedule.trainNum }}</li>
                  <li>正确数量：{{ trainSchedule.rightNum }}</li>
                  <li>错误数量：{{ trainSchedule.errorNum }}</li>
                </el-card>
              </el-col>
            </template>
          </template>
        </el-row>
      </div>
      <el-divider></el-divider>
      <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
      <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      <el-button icon="el-icon-close" size="mini" type="danger" @click="outTrain">退出</el-button>
      <el-table border v-loading="loading" :data="specialRecordList" @selection-change="handleSelectionChange">
        <el-table-column resizable show-overflow-tooltip label="编码" align="center" prop="bank.code">
        </el-table-column>
        <el-table-column resizable show-overflow-tooltip label="内容" align="center" prop="bank.content">
        </el-table-column>
        <el-table-column resizable show-overflow-tooltip label="解析" align="center" prop="bank.analysis">
        </el-table-column>
        <el-table-column resizable show-overflow-tooltip label="结果" align="center">
          <template v-slot="{row}">
            <el-tag type='success' size="mini" v-if="row.result === options.RESULT_TYPE.enums.RIGHT.value">正确</el-tag>
            <el-tag type='danger' size="mini" v-else>错误</el-tag>
          </template>
        </el-table-column>
        <el-table-column resizable label="操作" align="center" class-name="small-padding fixed-width">
          <template slot-scope="scope">
            <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">
              查看
            </el-button>
          </template>
        </el-table-column>
      </el-table>

      <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
                  :limit.sync="queryParams.pageSize" @pagination="getList"/>
    </div>
    <div v-if="questionVisible">
      <question @back="handleBack" ref="question" :isTraining="isTraining"
                :train-info="{subjectId: this.subjectId , knowledgePointId:this.knowledgePointId ,postId: this.postId}"/>
    </div>
  </div>
</template>
<script src="./specialTrain.js"></script>

<style>

</style>
